/**
 * app.js
 */
import React from 'react';
import Router, {Route, DefaultRoute , RouteHandler} from 'react-router';
import RouterContainer from './services/RouterContainer';
import LoginActions from './actions/login';
import AMR, {Topbar, Nav,CollapsibleNav,Container} from 'amazeui-react';


<% if (app.components) {
%> /* [COMPONENTS] */ <%
underscore.each(app.components , function(path , name) { %>
import <%= name %> from '<%= path %>';
<% }); %>
/* [COMPONENTS] */
<% } %>

class App extends React.Component {
	constructor() {
		super()
	}
	render() {
		return (
			<div className="ask-page">
	          <Topbar
	            className="ask-header"
	            brand="Amaze UI"
	            brandLink="/"
	            inverse>
	            <CollapsibleNav>
	              <Nav topbar>
	  			<% if (app.pages) {
	  			underscore.each(app.pages , function(path , name) { %><RouteLink to="<%= name.toLowerCase() %>"><%= name %></RouteLink>
	  			<% });
	  			} %>
	              </Nav>
	            </CollapsibleNav>
	          </Topbar>
	          <main className="ask-main">
	            <RouteHandler />
	          </main>
	          <SiteFooter />
	        </div>
		);
	}
}
/* [PAGES] */
import Index from './pages/index';
<% if (app.pages) {
underscore.each(app.pages , function(path , name) { %>
import <%= name %> from '<%= path %>';
<% });
}%>
/* [PAGES] */

/* [ROUTES] */
var routes = (
  <Route name="app" path="/" handler={App}>
    <DefaultRoute name="index" handler={Index} />
	<% if (app.pages) {
underscore.each(app.pages , function(path , name) { %><Route name='<%= name.toLowerCase() %>' handler={<%= name %>} />
	<% });
	} %>
  </Route>
);
/* [ROUTES] */

var router = Router.create({routes});
RouterContainer.set(router);

let jwt = localStorage.getItem('jwt');
if (jwt) {
  LoginActions.loginUser(jwt);
}
/**
 * render to the page
 */
document.addEventListener('DOMContentLoaded', function() {
	Router.run(routes , function (Handler) {
  		React.render(<Handler />, document.body);
	});
});
